import { Text, View } from '@tarojs/components';
import { ReactNode } from 'react';

export default function Empty(props: {
  title: string;
  desc?: ReactNode;
  children?: ReactNode;
  icon: ReactNode;
}) {
  return (
    <View className=' flex flex-col items-center'>
      {props.icon}

      <Text className=' text-lg text-black font-bold -mt-[40px] block'>
        {props.title}
      </Text>
      {props.desc && (
        <Text className=' w-[520px] mx-auto text-xs text-center text-gary1 mt-2'>
          {props.desc}
        </Text>
      )}

      {props.children && <View className=' mt-[100px]'>{props.children}</View>}
    </View>
  );
}
